<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<meta name="copyright" content="www.infoearth.com" />
		<title>地质灾害应急调查</title>
		<link rel="stylesheet" type="text/css" href="../css/api.css"/>
		<link rel="stylesheet" href="../lib/leaflet/leaflet.css">
		<script src="../lib/jquery.mobile-1.4.5/jquery.min.js"></script>
		<script src="../lib/leaflet/leaflet.js"></script>
		<script src="../lib/config.js"></script>
		<script src="../lib/common.js"></script>
		<style>
			body {
				padding: 0;
				margin: 0;
			}
			html, body, #map {
				height: 100%;
			}
		</style>
	</head>
	<body>
		<div id="map" style="height:300px;width:100%;"></div>
		<div style="position:fixed;z-index:999;bottom:5px;left:10px">
			<img id="imgLocation" src="../image/location.png" style="width:32px;height:32px;"/>
		</div>
	</body>
	<script type="text/javascript" src="../script/api.js"></script>
	<script type="text/javascript">
		var map = null;
		var marker = null;
		apiready = function() {
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				api.closeFrame();
			});
			$("#map").height(api.winHeight);
			$("#imgLocation").click(function() {
				getLocation();
			});
			//初始化地图
			initialMap();
			//获取地理位置
			$("#btnSave").click();
		}
		function getLocation() {
			console.log('获取设备所处位置');
			//获取设备所处位置
			var baiduLocation = api.require('baiduLocation');
			baiduLocation.startLocation({
				accuracy : '10m',
				filter : 1,
				autoStop : true
			}, function(ret, err) {
				var sta = ret.status;
				if (sta) {
					var str = '经度：' + ret.longitude + '<br>';
					str += '纬度：' + ret.latitude + '<br>';
					str += '更新时间：' + ret.timestamp + '<br>';
					console.log(str);
					showLocation2Map(ret.longitude, ret.latitude);
				} else
					console.log(err.msg);
			});
		}

		function showLocation2Map(lon, lat) {
			var pos = [lat, lon];
			if (marker == null)
				L.marker(pos).addTo(map);
			else
				marker.setLatLng(pos);
			//定位
			map.panTo(pos);
		}
	</script>
</html>